import './App.css';
import React from 'react';
import Home from "./pages/home/home.jsx"
import { Layout, Menu, Breadcrumb } from 'antd';
import "./App.css"
const { Header, Content, Footer } = Layout;

function App() {
  return (
    <div className="App">
      <Layout>
        <Header style={{ position: 'fixed', zIndex: 1, width: '100%' }}>
          <span className="logo-name">React 18</span>
          <Menu theme="dark" mode="horizontal" defaultSelectedKeys={['1']}>
            <Menu.Item key="1">首页</Menu.Item>
            <Menu.Item key="2">内容</Menu.Item>
            <Menu.Item key="3">我的</Menu.Item>
          </Menu>
        </Header>
        <Content className="site-layout" style={{ padding: '0 50px', marginTop: 64 }}>
          <Home></Home>
        </Content>
        <Footer style={{ textAlign: 'center' }}>React 18 Demo©2022 Created by CHR</Footer>
      </Layout>
    </div>
  );
}

// class App extends React.Component {
//   constructor(props) {
//     super(props);

//   }

//   click(){
//     console.log(this)
//   }

//   render(){
//     return (
//       <div>
//         <button onClick={this.click}>click</button>
//       </div>
//     )
//   }
// }

export default App;
